import * as React from 'react'
import './index.less'
import NavHeader from '../../components/NavHeader'
import {Link} from 'react-router-dom'
import {connect} from 'react-redux'
import {Session,Store} from '../../store/types'
import actions from '../../store/actions/session'

let profile = require('../../image/下载 (1).png')
interface Props {
  history:any,
  login:any

}
class Login extends React.Component<Props> {
  login=()=>{
    let username = (this.refs.username as any).value
    let password = (this.refs.password as any).value
    this.props.login({username,password})
  }
  render() {  
    // this.props.location.state从路由传过来的state值
    return (
      <div className="login">
        <NavHeader title='登录' history={this.props.history}/>
        <div className="login-logo">
          <img src={profile} />
        </div>
        <input type="text" placeholder="手机" ref="username"/>
        <input type="text" placeholder="密码" ref="password"/>
        <Link to='/reg'>前往注册</Link>
        <button onClick={this.login}>登录</button>
      </div>
    )
  }
}
 
export default connect(
  (state:Store):Session=>state.session,
  actions
)(Login) 